<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath %>">
<title>订单管理</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<%-- 引用layui.css --%>
<link rel="stylesheet" type="text/css" href="<%=basePath %>js/layui/css/layui.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath %>css/common.css" />
<link rel="stylesheet" type="text/css" href="<%=basePath %>css/laydate.css" />
<script type="text/javascript" src="<%=basePath%>js/laydate.js"></script>
</head>
<body>
	<div class="ibox">
		<div class="ibox-content bodycss">
			<!-- 表单搜索 开始 -->
		 	<section class="panel panel-padding ">
			<form class="layui-form layui-form-pane form-search"
				onsubmit="return false" method="post">
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">订单编号</label>
					<div class="layui-input-inline">
						<input name="order_sn" id="order_sn" placeholder="请输会员的入订单号"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员tvn号</label>
					<div class="layui-input-inline">
						<input name="user_id" id="user_id"  placeholder="请输入会员的tvn号"
							class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员名称</label>
					<div class="layui-input-inline">
						<input name="user_name" id="user_name" placeholder="请输入会员名称"
							class="layui-input">
					</div>
				</div>				
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员卡号</label>
					<div class="layui-input-inline">
						<input name="user_card_number" id="user_card_number" placeholder="请输入会员卡号"
							class="layui-input">
					</div>
				</div>	<br>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员电话</label>
					<div class="layui-input-inline">
						<input name="receiver_phone" id="receiver_phone" placeholder="请输入会员电话"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">订单时间</label>
					<div class="layui-input-inline">
						<input name="leftAdd_time" id="leftAdd_time" placeholder="请选择时间"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">至</label>
					<div class="layui-input-inline">
						<input name="rightAdd_time" id="rightAdd_time" placeholder="请选择时间"
							class="layui-input">
					</div>
				</div>	
				<div class="layui-form-item layui-inline">
					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="seach">
						<i class="layui-icon"></i> 搜 索
					</button>
				</div>
			</form>
			</section>
			<!-- 表单搜索 结束 -->
			<section class="panel panel-padding ">
			<table class="layui-table"
				lay-data="{
	                        id:'menuTeble',
	                        width:'auto',
	                        url:'shipping/getShippingList.do',
	                        page:true,
	                        even:true,
	                        skin:'row',
	                        limits:[10,20,30,40,50],
	                        limit:10,
							method:'post'                      
	                        }"
				lay-filter="popedomLay" id = "dataTable">
				<!-- 需要将默认的请求的方式改变一下，改为post即可 -->
				<thead>
					<tr>
						<th lay-data="{checkbox:true,disabledKey:'check_status',disabledKeyValue:'1,2'}"></th>
						<th lay-data="{type:'numbers', width:50}">序号</th>
						<th lay-data="{field:'user_id', width:100, align:'center'}">会员tvn号</th>
						<th lay-data="{field:'receipt_method', width:100,align:'center',templet:'#receiptMethod'}">收货方式</th>
						<th lay-data="{field:'goods_amount', width:120,align:'center'}">订单总价格</th>
						<th lay-data="{field:'user_card_number', width:100,align:'center'}">会员卡号</th>
						<th lay-data="{field:'receiver_phone', width:100,align:'center'}">会员电话</th>
						<th lay-data="{field:'user_name', width:100,align:'center'}">会员姓名</th>
						<th lay-data="{field:'receiver_address', width:120,align:'center'}">收货人地址</th>
						<th lay-data="{field:'order_sn', width:200,align:'center'}">订单编号</th>
						<th lay-data="{field:'add_time', width:150,align:'center'}">订单生成的时间</th>
						<th lay-data="{field:'goods_name', width:100,align:'center'}">商品名称</th>
						<th lay-data="{field:'goods_num', width:100,align:'center'}">商品数量</th>
						<th lay-data="{field:'order_state', width:80,align:'center'}">订单的状态</th>
						<th lay-data="{field:'goods_type', width:80,align:'center',templet:'#productAttributes'}">商品属性</th>
						<th lay-data="{fixed: 'right', width:150, align:'center', toolbar: '#popedomBar'}">操作</th>
					</tr>
				</thead>
			</table>
			</section>
		</div>
	</div>
	
	<script type="text/html" id="receiptMethod">	
	    {{#  if(d.receipt_method == "0") {  }}
			<font color="#00ff00">上门送</font>
		{{#  } else if(d.receipt_method == "1") {  }}
			<font color="#ff0000">自取</font>
		{{#  }  }}
    </script>
    <script type="text/html" id="productAttributes">
    	{{#  if(d.goods_type == "0") {  }}
			<font color="#DC143C">正品</font>
		{{#  } else if(d.goods_type == "1") {  }}
			<font color="#00BFFF">打折</font>
		{{#  } else if(d.goods_type == "2") {  }}
			<font color="#00FF00">体验</font>
		{{#  } else if(d.goods_type == "3") {  }}
			<font color="#FFD700">积分兑换</font>
		{{#  } else if(d.goods_type == "4") {  }}
			<font color="#F08080">用来打包</font>
		{{#  } else if(d.goods_type == "5") {  }}
			<font color="#9400D3">打包品</font>
		{{#  } else if(d.goods_type == "7") {  }}
			<font color="#DDA0DD">可兑换打包品</font>
		{{#  }  }}
    </script>
	<script type="text/html" id="popedomBar">
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="fahuo" >订单发货</a>
    </script>
    <script type="text/javascript" src="<%=basePath%>js/layui/layui.js"></script>
	<script type="text/javascript">
	layui.config({ base: "<%=basePath%>/js/common/"}).use(["common", "element",  "form", "table", "jquery"], function(){
			var elem = layui.element;
			var layer = layui.layer;
			var form = layui.form;
			var table = layui.table;
			var $ = layui.jquery;
			/**
			 * 监听刷新表格
			 */
			form.on('submit(seach)', function(data){
				// layer.msg(JSON.stringify(data.field));
				table.reload('menuTeble', {
					where: data.field,
				});
				return false;
			});
			
			/*
				监听更新			
			*/
			table.on('tool(popedomLay)',function(obj){
				var data = obj.data;
				var even = obj.event;
				var id = data.order_sn;
				$.ajax({
					url : "${pageContext.request.contextPath}/shipping/updateOrder.do",
					type : "post",
					data : {
						"id" : id
					},
					success : function(data){
						if(data.satausCode == 200){
							layer.msg(data.message,{icon:6,time:2000})
							table.reload('menuTeble',{
								where : data.field
							})
						}else{
							layer.msg(data.message,{icon:5,time:2000})
						}
					}
				})
			})
	});
	
</script>
<script type="text/javascript">
		let start_a = laydate.render({
	 				elem: '#leftAdd_time', //指定元素
	 				trigger: 'click', //采用click弹出
			        theme: '#3278F0',
			        done: function (value, date, endDate) {
			            end.config.min = {
			                year: date.year,
			                month: date.month - 1,
			                date: date.date,
			            }; //开始日选好后，重置结束日的最小日期
			            end.config.value = {
			                year: date.year,
			                month: date.month - 1,
			                date: date.date,
			            }; //将结束日的初始值设定为开始日
			        }
		});
	let end = laydate.render({
 				elem: '#rightAdd_time', //指定元素
 				trigger: 'click', //采用click弹出
		        theme: '#3278F0',
		        done: function (value, date, endDate) {
		            start_a.config.max = {
		                year: date.year,
		                month: date.month - 1,
		                date: date.date,
		            }; //结束日选好后，重置开始日的最大日期
		        }
		});

</script>
</body>
</html>
